import { Input, PageContainer, View } from "@tarojs/components"
import React, { useEffect, useState } from "react"
import "./index.scss"

const Response: React.FC<{
    show: boolean,
    onClose?: (str: string) => void
    onFinish?: (str: string) => void
}> = ({ show, onClose, onFinish }) => {
    const [content, setContent] = useState('')
    useEffect(() => {
        setContent('')
    }, [show])
    return (
        <PageContainer show={show} onLeave={() => onClose && onClose(content)} overlay round zIndex={9999}>
            <View className="response-input-content flex-row flex-item">
                {
                    show ? <Input value={content} focus className="comment-input flex1" onInput={e => setContent(e.detail.value)} placeholder="说点什么..."></Input> : null
                }
                <View className="btn save-btn flex-row flex-center"
                    onClick={() => onFinish && onFinish(content)}
                    style={{ width: '140rpx' }}>
                    发表评论
                </View>
            </View>
        </PageContainer>
    )
}

export default Response